<template>
  <view class="viewpoint">
    <!-- 轮播图 -->
    <view class="swiper">
      <swiper
        class="swiper"
        circular
        :indicator-dots="true"
        :autoplay="true"
        :interval="3000"
        :duration="1000"
        indicator-active-color="#fff"
        indicator-color="#B8D587"
      >
        <swiper-item>
          <view class="swiper-item">
            <image
              src="http://smzacc0p8.hn-bkt.clouddn.com/swp_1.jpg"
              mode="scaleToFill"
            />
          </view>
        </swiper-item>
        <swiper-item>
          <view class="swiper-item">
            <image
              src="http://smzacc0p8.hn-bkt.clouddn.com/swp_2.jpg"
              mode="scaleToFill"
            />
          </view>
        </swiper-item>
        <swiper-item>
          <view class="swiper-item">
            <image
              src="http://smzacc0p8.hn-bkt.clouddn.com/swp_3.jpg"
              mode="scaleToFill"
            />
          </view>
        </swiper-item>
      </swiper>
    </view>
    <!-- 公告 -->
    <view class="noticelist">
      <scroll-view scroll-y="true" class="scroll-Y">
        <view
          @tap="ToNotice(item)"
          v-for="item in noticelist"
          :key="item.id"
          class="scroll-view"
        >
          <text>{{ item?.title }}</text>
          <uni-icons type="right" size="16"></uni-icons>
        </view>
      </scroll-view>
    </view>
  </view>
</template>

<script setup>
import { ref, defineProps, defineEmits } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import { getUserInfo, getNotice } from "../../utils/index";
import { InfoStore } from "../../store/index";
const useInfoStore = InfoStore();
const noticelist = ref([]); //公告列表
//获取用户信息
const getInfo = async () => {
  const res = await getUserInfo();
  if (res?.data.code === 200) {
    useInfoStore.setProfile(res?.data?.data);
    console.log(useInfoStore.LoginInfo);
  }
};
//获取公告
const getNoticeList = async () => {
  const res = await getNotice();
  if (res?.data.code === 200) {
    noticelist.value = res?.data?.data;
  }
};
//查看公告
const ToNotice = (item) => {
  // console.log(item);
  uni.navigateTo({
    url: `/pageA/notdetail/notdetail?id=${item.id}`,
  });
};
onLoad(() => {
  Promise.all([getInfo(), getNoticeList()]);
});
</script>

<style lang="scss">
page {
  height: 100%;
  background: linear-gradient(to bottom, #f8f8f8, #edf6e3, #cff2a2);
}

.viewpoint {
  width: 100%;
  height: 100%;
  padding: 10rpx 15rpx;
  box-sizing: border-box;
}

.swiper {
  width: 100%;
  height: 400rpx;
  border-radius: 10rpx;
  overflow: hidden;

  .swiper-item {
    width: 100%;
    height: 100%;

    image {
      width: 100%;
      height: 100%;
    }
  }
}

.noticelist {
  width: 100%;
  margin-top: 15rpx;
  height: calc(100vh - 450rpx);

  .scroll-Y {
    width: 100%;
    height: 100%;

    .scroll-view {
      height: 100rpx;
      background: #ffffff;
      border-radius: 5rpx solid #100f0f;
      box-shadow: 0 4rpx 5rpx rgba(200, 200, 200, 0.3);
      line-height: 100rpx;
      color: #1c1c1c;
      text-align: left;
      font-size: 36rpx;
      margin-top: 15rpx;
      padding-left: 15rpx;
      display: flex;
      justify-content: space-between;
    }
  }
}
</style>